import { Component } from "react/cjs/react.production.min";
import Tabs from "@mui/material/Tabs";
import Tab from "@mui/material/Tab";
import Box from "@mui/material/Box";

class CategoryTab extends Component {
  constructor() {
    super();
    this.state = {
      currTab: "todo",
    };
  }
  handleChange(e, newTab) {
    this.setState({ currTab: newTab });
    this.props.onChange(e, newTab);
  }
  render() {
    return (
      <Box>
        <Tabs
          value={this.state.currTab}
          onChange={this.handleChange.bind(this)}
          textColor="secondary"
          indicatorColor="secondary"
        >
          <Tab value="todo" label="TODO" />
          <Tab value="finished" label="已完成" />
        </Tabs>
      </Box>
    );
  }
}

export default CategoryTab;
